﻿@model SMECustomerWebsite.Models.ViewModels.CustomerManager.CustomerPortfolioViewModel

@Html.Action("SubMenuCustomer", "System")
<!-- start accordion -->
<div class="accordion cm-accordion" id="accordion" role="tablist" aria-multiselectable="true">
    @if (Model.listGroupRecord.Count == 0)
    {
        <h2>@SMECustomerWebsite.Core.Resources.Resource.MessNoCust</h2>
    }
    else
    {
        @Html.Action("CustInfo", "System")
    }
    @foreach (var item in Model.listGroupRecord)
    {
        switch (item.GroupCode)
        {
            case "deposit":
                <div class="panel" id="panel_deposit">
                    <div class="panel-heading collapsed">
                        <a role="tab" id="headingOne-@item.GroupCode" data-toggle="collapse" data-parent="#accordion" href="#collapseOne-@item.GroupCode" aria-expanded="false" aria-controls="collapseOne-@item.GroupCode">
                            <h4 class="panel-title cm_cp_gr_general_lbl">@SMECustomerWebsite.Core.Resources.Resource.GrDeposit</h4>
                        </a>
                        <span id="total-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_total">@SMECustomerWebsite.Core.Resources.Resource.TotalLbl (@item.TotalCustomer)</span>
                        @*<span id="new-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_new">@SMECustomerWebsite.Core.Resources.Resource.NewLbl (@item.NewCustomerByRule)</span>
                            <a data-toggle="modal" data-target=".cm-cp-@item.GroupCode-modal" class="cm_cp_gr_lbl_new"><i class="fa fa-question-circle" data-toggle="tooltip" data-placement="top" title="" data-original-title="@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustDeposit"></i></a>*@
                    </div>
                    <!-- Small modal -->
                    <div class="modal fade cm-cp-@item.GroupCode-modal tip_modal" tabindex="-1" role="dialog" aria-hidden="true">
                        <div class="modal-dialog modal-sm">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                        <span aria-hidden="true">×</span>
                                    </button>
                                    <h4 class="modal-title" id="myModalLabel2">@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustDeposit</h4>
                                </div>
                                <div class="modal-body">
                                    <h4>@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustDepositTextHeader</h4>
                                    <p>@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustDepositTextContent</p>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- /modals -->
                    @Html.Action("CustByProductDepositTableTemp", "System")
                </div>
                break;
            case "loan":
            <div class="panel" id="panel_loan">
                <div class="panel-heading collapsed">
                    <a role="tab" id="headingOne-@item.GroupCode" data-toggle="collapse" data-parent="#accordion" href="#collapseOne-@item.GroupCode" aria-expanded="false" aria-controls="collapseOne-@item.GroupCode">
                        <h4 class="panel-title cm_cp_gr_general_lbl">@SMECustomerWebsite.Core.Resources.Resource.GrLoan</h4>
                    </a>
                    <span id="total-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_total">@SMECustomerWebsite.Core.Resources.Resource.TotalLbl (@item.TotalCustomer)</span>
                    @*<span id="new-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_new">@SMECustomerWebsite.Core.Resources.Resource.NewLbl (@item.NewCustomerByRule)</span>
                        <a data-toggle="modal" data-target=".cm-cp-@item.GroupCode-modal" class="cm_cp_gr_lbl_new"><i class="fa fa-question-circle" data-toggle="tooltip" data-placement="top" title="" data-original-title="@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustLoan"></i></a>*@
                </div>
                <!-- Small modal -->

                <div class="modal fade cm-cp-@item.GroupCode-modal tip_modal" tabindex="-1" role="dialog" aria-hidden="true">
                    <div class="modal-dialog modal-sm">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                    <span aria-hidden="true">×</span>
                                </button>
                                <h4 class="modal-title" id="myModalLabel2">@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustLoanTextHeader</h4>
                            </div>
                            <div class="modal-body">
                                <h4>@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustLoanTextHeader</h4>
                                <p>@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustLoanTextContent</p>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- /modals -->
                <!-- Small modal -->

                <div class="modal fade cm-cp-new-lending-detail tip_modal" tabindex="-1" role="dialog" aria-hidden="true">
                    <div class="modal-dialog modal-lg">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                    <span aria-hidden="true">×</span>
                                </button>
                            </div>
                            <div class="modal-body">
                                <table id="cm-cp-tb-new-lending-detail" class="table custom_table table-bordered table-striped jambo_table">
                                    <thead class="headings">
                                        <tr>
                                            <th class="column-title">CIF</th>
                                            <th class="column-title">@SMECustomerWebsite.Core.Resources.Resource.NameHeader</th>
                                            <th class="column-title">@SMECustomerWebsite.Core.Resources.Resource.ProgrammeProduct.ToUpper()</th>
                                            <th class="column-title">@SMECustomerWebsite.Core.Resources.Resource.DistDateHeader</th>
                                            <th class="column-title">ACCTNO</th>
                                            <th class="column-title">@SMECustomerWebsite.Core.Resources.Resource.BalanceHeader</th>
                                        </tr>
                                    </thead>
                                    <tbody></tbody>
                                </table>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- /modals -->
                @Html.Action("CustByProductLoanTableTemp", "System")
            </div>
                break;
            case "card":
            <div class="panel" id="panel_card">
                <div class="panel-heading collapsed">
                    <a role="tab" id="headingOne-@item.GroupCode" data-toggle="collapse" data-parent="#accordion" href="#collapseOne-@item.GroupCode" aria-expanded="false" aria-controls="collapseOne-@item.GroupCode">
                        <h4 class="panel-title cm_cp_gr_general_lbl">@SMECustomerWebsite.Core.Resources.Resource.GrCard</h4>
                    </a>
                    <span id="total-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_total">@SMECustomerWebsite.Core.Resources.Resource.TotalLbl (@item.TotalCustomer)</span>
                    @*<span id="new-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_new">@SMECustomerWebsite.Core.Resources.Resource.NewLbl (@item.NewCustomerByRule)</span>
                        <a data-toggle="modal" data-target=".cm-cp-@item.GroupCode-modal" class="cm_cp_gr_lbl_new"><i class="fa fa-question-circle" data-toggle="tooltip" data-placement="top" title="" data-original-title="@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustCard"></i></a>*@
                </div>
                <!-- Small modal -->

                <div class="modal fade cm-cp-@item.GroupCode-modal tip_modal" tabindex="-1" role="dialog" aria-hidden="true">
                    <div class="modal-dialog modal-sm">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                    <span aria-hidden="true">×</span>
                                </button>
                                <h4 class="modal-title" id="myModalLabel2">@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustCard</h4>
                            </div>
                            <div class="modal-body">
                                <h4>Text in a modal</h4>
                                <p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p>
                                <p>Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</p>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- /modals -->
                @Html.Action("CustByProductCardTableTemp", "System")

            </div>
                break;
            case "i2b":
            <div class="panel" id="panel_i2b">
                <div class="panel-heading collapsed">
                    <a role="tab" id="headingOne-@item.GroupCode" data-toggle="collapse" data-parent="#accordion" href="#collapseOne-@item.GroupCode" aria-expanded="false" aria-controls="collapseOne-@item.GroupCode">
                        <h4 class="panel-title cm_cp_gr_general_lbl">@SMECustomerWebsite.Core.Resources.Resource.GrI2B</h4>
                    </a>
                    <span id="total-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_total">@SMECustomerWebsite.Core.Resources.Resource.TotalLbl (@item.TotalCustomer)</span>
                    @*<span id="new-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_new">@SMECustomerWebsite.Core.Resources.Resource.NewLbl (@item.NewCustomerByRule)</span>
                        <a data-toggle="modal" data-target=".cm-cp-@item.GroupCode-modal" class="cm_cp_gr_lbl_new"><i class="fa fa-question-circle" data-toggle="tooltip" data-placement="top" title="" data-original-title="@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustI2B"></i></a>*@
                </div>
                <!-- Small modal -->

                <div class="modal fade cm-cp-@item.GroupCode-modal tip_modal" tabindex="-1" role="dialog" aria-hidden="true">
                    <div class="modal-dialog modal-sm">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                    <span aria-hidden="true">×</span>
                                </button>
                                <h4 class="modal-title" id="myModalLabel2">@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustI2B</h4>
                            </div>
                            <div class="modal-body">
                                <h4>@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustI2BTextHeader</h4>
                                <p>@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustI2BTextContent</p>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- /modals -->
                @Html.Action("CustByProductI2BTableTemp", "System")
            </div>
                break;
            case "pos":
            <div class="panel" id="panel_pos">
                <div class="panel-heading collapsed">
                    <a role="tab" id="headingOne-@item.GroupCode" data-toggle="collapse" data-parent="#accordion" href="#collapseOne-@item.GroupCode" aria-expanded="false" aria-controls="collapseOne-@item.GroupCode">
                        <h4 class="panel-title cm_cp_gr_general_lbl">@SMECustomerWebsite.Core.Resources.Resource.GrPos</h4>
                    </a>
                    <span id="total-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_total">@SMECustomerWebsite.Core.Resources.Resource.TotalLbl (@item.TotalCustomer)</span>
                    @*<span id="new-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_new">@SMECustomerWebsite.Core.Resources.Resource.NewLbl (@item.NewCustomerByRule)</span>
                        <a data-toggle="modal" data-target=".cm-cp-@item.GroupCode-modal" class="cm_cp_gr_lbl_new"><i class="fa fa-question-circle" data-toggle="tooltip" data-placement="top" title="" data-original-title="@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustPos"></i></a>*@
                </div>
                <!-- Small modal -->

                <div class="modal fade cm-cp-@item.GroupCode-modal tip_modal" tabindex="-1" role="dialog" aria-hidden="true">
                    <div class="modal-dialog modal-sm">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                    <span aria-hidden="true">×</span>
                                </button>
                                <h4 class="modal-title" id="myModalLabel2">@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustPos</h4>
                            </div>
                            <div class="modal-body">
                                <h4>@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustPosTextHeader</h4>
                                <p>@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustPosTextContent</p>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- /modals -->
                @Html.Action("CustByProductPosTableTemp", "System")

            </div>
                break;
            case "trade":
            <div class="panel" id="panel_trade">
                <div class="panel-heading collapsed">
                    <a role="tab" id="headingOne-@item.GroupCode" data-toggle="collapse" data-parent="#accordion" href="#collapseOne-@item.GroupCode" aria-expanded="false" aria-controls="collapseOne-@item.GroupCode">
                        <h4 class="panel-title cm_cp_gr_general_lbl">@SMECustomerWebsite.Core.Resources.Resource.GrTrade</h4>
                    </a>
                    <span id="total-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_total">@SMECustomerWebsite.Core.Resources.Resource.TotalLbl (@item.TotalCustomer)</span>
                    @*<span id="new-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_new">@SMECustomerWebsite.Core.Resources.Resource.NewLbl (@item.NewCustomerByRule)</span>
                        <a data-toggle="modal" data-target=".cm-cp-@item.GroupCode-modal" class="cm_cp_gr_lbl_new"><i class="fa fa-question-circle" data-toggle="tooltip" data-placement="top" title="" data-original-title="@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustTrade"></i></a>*@
                </div>
                <!-- Tip new cust modal -->

                <div class="modal fade cm-cp-@item.GroupCode-modal tip_modal" tabindex="-1" role="dialog" aria-hidden="true">
                    <div class="modal-dialog modal-sm">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                    <span aria-hidden="true">×</span>
                                </button>
                                <h4 class="modal-title" id="myModalLabel2">@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustTrade</h4>
                            </div>
                            <div class="modal-body">
                                <h4>@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustTradeTextHeader</h4>
                                <p>@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustTradeTextContent</p>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- /modals -->
                @Html.Action("CustByProductTradeTableTemp", "System")
            </div>
                break;
            case "chuoi":
            <div class="panel" id="panel_chuoi">
                <div class="panel-heading collapsed">
                    <a role="tab" id="headingOne-@item.GroupCode" data-toggle="collapse" data-parent="#accordion" href="#collapseOne-@item.GroupCode" aria-expanded="false" aria-controls="collapseOne-@item.GroupCode">
                        <h4 class="panel-title cm_cp_gr_general_lbl">@SMECustomerWebsite.Core.Resources.Resource.GrSupChain.ToUpper()</h4>
                    </a>
                    <span id="total-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_total">@SMECustomerWebsite.Core.Resources.Resource.TotalLbl (@item.TotalCustomer)</span>
                    @*<span id="new-@item.GroupCode-lbl" class="panel-title cm_cp_gr_lbl_new">@SMECustomerWebsite.Core.Resources.Resource.NewLbl (@item.NewCustomerByRule)</span>
                        <a data-toggle="modal" data-target=".cm-cp-@item.GroupCode-modal" class="cm_cp_gr_lbl_new"><i class="fa fa-question-circle" data-toggle="tooltip" data-placement="top" title="" data-original-title="@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustSupChain"></i></a>*@
                </div>
                <!-- Tip new cust modal -->

                <div class="modal fade cm-cp-@item.GroupCode-modal tip_modal" tabindex="-1" role="dialog" aria-hidden="true">
                    <div class="modal-dialog modal-sm">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                    <span aria-hidden="true">×</span>
                                </button>
                                <h4 class="modal-title" id="myModalLabel2">@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustSupChain</h4>
                            </div>
                            <div class="modal-body">
                                <h4>@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustSupChainTextHeader</h4>
                                <p>@SMECustomerWebsite.Core.Resources.Resource.TipForNewCustSupChainTextContent</p>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- /modals -->
                @Html.Action("CustByProductChuoiTableTemp", "System")
            </div>
                break;
            default:
                break;
        }
    }
</div>
<!-- end of accordion -->
@section scripts
{
    <script src="/scripts/tableeditable/dataTables.rowsGroup.js"></script>
    <script src="~/Scripts/custom_search_table.js"></script>
    <!-- bootstrap-daterangepicker -->
    <script src="~/scripts/datepicker/moment/moment.min.js"></script>
    <script src="~/scripts/datepicker/datepicker/daterangepicker.js"></script>
    @foreach (var item in Model.listGroupRecord)
    {
        switch (item.GroupCode)
        {
            case "deposit":
                <script type="text/javascript">
                    $(document).ready(function () {
                        var depositColumn = [
                                            { "sName": "CIF", "bSortable": false },
                                        { "sName": "NAME", "bSortable": false },
                                        { "sName": "VPB INDUSTRY", "bSortable": false },
                                        { "sName": "DATE OPEN CIF", "bSortable": false },
                                        { "sName": "BALANCE", "bSortable": false },
                                        { "sName": "INFO", "bSortable": false }]
                        var depositLenCol = 5;
                        var depositCifCol = 0;
                        switch (@Model.CurrentUser.GroupIdentifier) {
                            case 1:
                                depositColumn = [
                                        { "sName": "REGION", "bSortable": false },
                                        { "sName": "BRANCH", "bSortable": false },
                                        { "sName": "DAO", "bSortable": false },
                                        { "sName": "MSBO", "bSortable": false },
                                        { "sName": "CIF", "bSortable": false },
                                        { "sName": "NAME", "bSortable": false },
                                        { "sName": "VPB INDUSTRY", "bSortable": false },
                                        { "sName": "DATE OPEN CIF", "bSortable": false },
                                        { "sName": "BALANCE", "bSortable": false },
                                        { "sName": "INFO", "bSortable": false }];
                                depositLenCol = 9;
                                depositCifCol = 4;
                                break;
                            case 2:
                                depositColumn = [
                                        { "sName": "BRANCH", "bSortable": false },
                                        { "sName": "DAO", "bSortable": false },
                                        { "sName": "MSBO", "bSortable": false },
                                        { "sName": "CIF", "bSortable": false },
                                        { "sName": "NAME", "bSortable": false },
                                        { "sName": "VPB INDUSTRY", "bSortable": false },
                                        { "sName": "DATE OPEN CIF", "bSortable": false },
                                        { "sName": "BALANCE", "bSortable": false },
                                        { "sName": "INFO", "bSortable": false }];
                                depositLenCol = 8;
                                depositCifCol = 3;
                                break;
                            case 3:
                                depositColumn = [
                                        { "sName": "DAO", "bSortable": false },
                                        { "sName": "MSBO", "bSortable": false },
                                        { "sName": "CIF", "bSortable": false },
                                        { "sName": "NAME", "bSortable": false },
                                        { "sName": "VPB INDUSTRY", "bSortable": false },
                                        { "sName": "DATE OPEN CIF", "bSortable": false },
                                        { "sName": "BALANCE", "bSortable": false },
                                        { "sName": "INFO", "bSortable": false }];
                                depositLenCol = 7;
                                depositCifCol = 2;
                                break;
                            default:
                                break;
                        }

                        $('#total-@item.GroupCode-lbl').click(function () {
                            $('#collapseOne-@item.GroupCode').collapse('show');
                        });
                        $('#new-@item.GroupCode-lbl').click(function () {
                            $('#collapseOne-@item.GroupCode').collapse('show');
                        });

                        var optionDepositTable = {
                            //"order": [[0, 'asc']],
                            "bServerSide": true,
                            "bProcessing": true,
                            "responsive": true,
                            "bAutoWidth": false,
                            "bSortable": true,
                            //"bFilter": false,
                            "aLengthMenu": [10, 30, 50, 100],
                            "pageLength": 10,
                            destroy: true,
                            //rowsGroup: [0, 1, 2, 3],
                            "sAjaxSource": '@Url.Action("CustomerPortfolioData","CustomerManager")' + '?type=@item.GroupCode',
                            "fnServerData": function (sSource, aoData, fnCallback) {
                                $.ajax({
                                    "dataType": 'json',
                                    "type": "POST",
                                    "url": sSource,
                                    "data": aoData,
                                    "success": fnCallback
                                });
                            },
                            "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
                            "sPaginationType": "simple_numbers",//"full_numbers",
                            "aoColumns": depositColumn,
                            "aoColumnDefs": [{
                                "sClass": "column-title",
                                "aTargets": [depositLenCol],
                                "mRender": function (data, type, full) {
                                    return '<a class=\"btn btn-primary btn-xs\" onclick=\"showCustomerInfo(\'' + full[depositCifCol] + '\');\"><i class="fa fa-info"></i></a>';
                                }
                            }],
                            initComplete: function () {
                                this.api().columns().every(function () {
                                    var column = this;
                                    switch (column.context[0].aoHeader[0][column.index()].cell.innerText) {
                                        case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.Zone.ToUpper())':
                                            createFilterRegion(column, '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.Zone)');
                                            break;
                                        case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.DateOpenCifHeader)':
                                            createFilterDate(column);
                                            break;
                                        case '@Html.Raw(@SMECustomerWebsite.Core.Resources.Resource.Branch.ToUpper())':
                                            createFilterBranch(column);
                                            break;
                                        case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.MSBONameHeader.ToUpper())':
                                            createFilterMSBOName(column, 1);
                                            break;
                                        case 'DAO':
                                            createFilterMSBOName(column, 2);
                                            break;
                                        default:
                                            if (column.index() < depositLenCol) {
                                                createFilterInputText(column);
                                            }
                                            break;
                                    }
                                });
                            },
                            "drawCallback": function (settings) {
                                $('table.custom_table th').removeClass().addClass('column-title');
                            }
                        };

                        var table = $('#cm-customer-portfolio-@item.GroupCode').DataTable(optionDepositTable);

                        $('#filter-deposit').on("click", function () {
                            optionDepositTable.sAjaxSource = '@Url.Action("CustomerPortfolioData","CustomerManager")' + '?type=@item.GroupCode&group=' + $(".select2_group_@item.GroupCode").val() + '&grouptype=' + $(".select2_group_element_@item.GroupCode").val();

                            $('#cm-customer-portfolio-deposit .sme_filter_remove').remove();

                            var table_filter = $('#cm-customer-portfolio-@item.GroupCode').DataTable(optionDepositTable);

                        });
                        var data = [{ id: 0, text: decodeHtml('@SMECustomerWebsite.Core.Resources.Resource.Product') }, { id: 1, text: decodeHtml('@SMECustomerWebsite.Core.Resources.Resource.ProgrammeProduct') }];
                        $(".select2_group_@item.GroupCode").select2({
                            placeholder: "Select a group",
                            data: data,
                        });
                        var isFirst = true;
                        if (isFirst) {
                            $(".select2_group_element_@item.GroupCode").select2({
                                placeholder: "Choose group first",
                            });
                            isFirst = false;
                        }

                        $(".select2_group_@item.GroupCode").on("change", function (e) {
                            $(".select2_group_element_@item.GroupCode").empty();
                            $.ajax({
                                url: '@Url.Action("ListGroupItem", "CustomerManager")',
                                type: "POST",
                                data: { type: $(".select2_group_@item.GroupCode").val(), product: "deposit" },
                                success: function (data_response) {
                                    $(".select2_group_element_@item.GroupCode").select2({
                                        placeholder: "Select element",
                                        data: data_response,
                                    });
                                }
                            })
                        });
                    })
                </script>
                break;
            case "loan":
            <script type="text/javascript">
                $(document).ready(function () {
                    var loanColumn = [
                                        { "sName": "CIF", "bSortable": false },
                                        { "sName": "NAME", "bSortable": false },
                                        { "sName": "VPB INDUSTRY", "bSortable": false },
                                        { "sName": "DATE OPEN CIF", "bSortable": false },
                                        { "sName": "BALANCE", "bSortable": false },
                                        { "sName": "NHOMNO", "bSortable": false },
                                        { "sName": "INFO", "bSortable": false }]
                    var loanLenCol = 6;
                    var loanCifCol = 0;
                    switch (@Model.CurrentUser.GroupIdentifier) {
                        case 1:
                            loanColumn = [
                                    { "sName": "REGION", "bSortable": false },
                                    { "sName": "BRANCH", "bSortable": false },
                                    { "sName": "DAO", "bSortable": false },
                                        { "sName": "MSBO", "bSortable": false },
                                        { "sName": "CIF", "bSortable": false },
                                        { "sName": "NAME", "bSortable": false },
                                        { "sName": "VPB INDUSTRY", "bSortable": false },
                                        { "sName": "DATE OPEN CIF", "bSortable": false },
                                        { "sName": "BALANCE", "bSortable": false },
                                        { "sName": "NHOMNO", "bSortable": false },
                                        { "sName": "INFO", "bSortable": false }]
                            loanLenCol = 10;
                            loanCifCol = 4;
                            break;
                        case 2:
                            loanColumn = [
                                    { "sName": "BRANCH", "bSortable": false },
                                    { "sName": "DAO", "bSortable": false },
                                        { "sName": "MSBO", "bSortable": false },
                                        { "sName": "CIF", "bSortable": false },
                                        { "sName": "NAME", "bSortable": false },
                                        { "sName": "VPB INDUSTRY", "bSortable": false },
                                        { "sName": "DATE OPEN CIF", "bSortable": false },
                                        { "sName": "BALANCE", "bSortable": false },
                                        { "sName": "NHOMNO", "bSortable": false },
                                        { "sName": "INFO", "bSortable": false }] ;
                            loanLenCol = 9;
                            loanCifCol = 3;
                            break;
                        case 3:
                            loanColumn =  [
                                    { "sName": "DAO", "bSortable": false },
                                        { "sName": "MSBO", "bSortable": false },
                                        { "sName": "CIF", "bSortable": false },
                                        { "sName": "NAME", "bSortable": false },
                                        { "sName": "VPB INDUSTRY", "bSortable": false },
                                        { "sName": "DATE OPEN CIF", "bSortable": false },
                                        { "sName": "BALANCE", "bSortable": false },
                                        { "sName": "NHOMNO", "bSortable": false },
                                        { "sName": "INFO", "bSortable": false }];
                            loanLenCol = 8;
                            loanCifCol = 2;
                            break;
                        default:
                            break;
                    }

                    var typeLoan = 'loan';

                    var optionLoanTable ={
                        "order": [[0, 'asc']],
                        "bServerSide": true,
                        "bProcessing": true,
                        "responsive": true,
                        "bAutoWidth": false,
                        "aLengthMenu": [10, 30, 50, 100],
                        "pageLength": 10,
                        //rowsGroup: [0, 1, 2, 3],
                        "sAjaxSource": '@Url.Action("CustomerPortfolioData","CustomerManager")' + '?type=' + typeLoan,
                        "fnServerData": function (sSource, aoData, fnCallback) {
                            $.ajax({
                                "dataType": 'json',
                                "type": "POST",
                                "url": sSource,
                                "data": aoData,
                                "success": fnCallback
                            });
                        },
                        "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
                        "sPaginationType": "simple_numbers",//"full_numbers",
                        "aoColumns": loanColumn,
                        "aoColumnDefs": [{
                            "sClass": "column-title",
                            "aTargets": [loanLenCol],
                            "mRender": function (data, type, full) {
                                return '<a class=\"btn btn-primary btn-xs\" onclick=\"showCustomerInfo(\'' + full[loanCifCol] + '\');\"><i class="fa fa-info"></i></a>';
                            }
                        }],
                        initComplete: function () {
                            this.api().columns().every(function () {
                                var column = this;
                                switch (column.context[0].aoHeader[0][column.index()].cell.innerText) {
                                    case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.Zone.ToUpper())':
                                        createFilterRegion(column, '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.Zone)');
                                        break;
                                    case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.DateOpenCifHeader)':
                                        createFilterDate(column);
                                        break;
                                    case '@Html.Raw(@SMECustomerWebsite.Core.Resources.Resource.Branch.ToUpper())':
                                        createFilterBranch(column);
                                        break;
                                    case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.MSBONameHeader.ToUpper())':
                                        createFilterMSBOName(column, 1);
                                        break;
                                    case 'DAO':
                                        createFilterMSBOName(column, 2);
                                        break;
                                    default:
                                        if (column.index() < loanLenCol) {
                                            createFilterInputText(column);
                                        }
                                        break;
                                }
                            });
                        },
                        "drawCallback": function (settings) {
                            $('table.custom_table th').removeClass().addClass('column-title');
                        }
                    }
                    var tableLoans = $('#cm-customer-portfolio-@item.GroupCode').DataTable(optionLoanTable);

                    $('#total-@item.GroupCode-lbl').click(function () {
                        //typeLoan = 'loan';
                        var tableLoans = $('#cm-customer-portfolio-@item.GroupCode').DataTable(optionLoanTable);
                        $('#collapseOne-@item.GroupCode').collapse('show');
                    });
                    $('#new-@item.GroupCode-lbl').click(function () {
                        typeLoan = 'new_loan';
                        optionLoanTable.sAjaxSource = '@Url.Action("CustomerPortfolioData","CustomerManager")' + '?type=' + typeLoan;
                        var table_new_loan = $('#cm-customer-portfolio-@item.GroupCode').DataTable(optionLoanTable);

                        table_new_loan.$('td').tooltip({
                            "delay": 0,
                            "track": true,
                            "fade": 100
                        });
                        $('#collapseOne-@item.GroupCode').collapse('show');
                    });
                    $('#filter-loan').click(function () {
                        typeLoan = 'loan';
                        optionLoanTable.sAjaxSource = '@Url.Action("CustomerPortfolioData","CustomerManager")' + '?type=' + typeLoan;
                        var table_filter_loan = $('#cm-customer-portfolio-@item.GroupCode').DataTable(optionLoanTable);
                    });
                    var dataLoan = [{ id: 0, text: decodeHtml('@SMECustomerWebsite.Core.Resources.Resource.PreLoanProgram') }, { id: 1, text: decodeHtml('@SMECustomerWebsite.Core.Resources.Resource.ProgrammeProduct') }, { id: 2, text: '@SMECustomerWebsite.Core.Resources.Resource.Product' }];
                    $(".select2_group_@item.GroupCode").select2({
                        placeholder: "Select a group",
                        data: dataLoan,
                    });

                    var isFirstLoan = true;
                    if (isFirstLoan) {
                        $(".select2_group_element_@item.GroupCode").select2({
                            placeholder: "Please choose group first"
                        });
                        isFirstLoan = false;
                    }
                    $(".select2_group_@item.GroupCode").on("change", function (e) {
                        $(".select2_group_element_@item.GroupCode").empty();
                        $.ajax({
                            url: '@Url.Action("ListGroupItem", "CustomerManager")',
                            type: "POST",
                            data: { type: $(".select2_group_@item.GroupCode").val(), product: "loan" },
                            success: function (data_response) {
                                $(".select2_group_element_@item.GroupCode").select2({
                                    placeholder: "Select element",
                                    data: data_response,
                                });
                            }
                        })
                    });
                })
            </script>

                if (true)
                {
                    <script type="text/javascript">
                        function showNewLending(cif) {
                            var tableDetailNewLending = $('#cm-cp-tb-new-lending-detail').DataTable({
                                "bServerSide": true,
                                "bProcessing": true,
                                "responsive": true,
                                "bAutoWidth": false,
                                "aLengthMenu": [10, 30, 50, 100],
                                "pageLength": 10,
                                //rowsGroup: [0, 1, 2,3],
                                bFilter: false,
                                bInfo: false,
                                bPaginate: false,
                                "sAjaxSource": '@Url.Action("NewLending", "CustomerManager")' + '?cif=' + cif,
                                "fnServerData": function (sSource, aoData, fnCallback) {
                                    $.ajax({
                                        "dataType": 'json',
                                        "type": "POST",
                                        "url": sSource,
                                        "data": aoData,
                                        "success": fnCallback
                                    });
                                },
                                "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
                                "sPaginationType": "simple_numbers",//"full_numbers",
                                destroy: true,
                                "aoColumns": [
                                            { "sName": "CIF", "bSortable": false },
                                            { "sName": "CUSTOMER NAME", "bSortable": false },
                                            { "sName": "CHUONG TRINH SP", "bSortable": false },
                                            { "sName": "DIST DATE", "bSortable": false },
                                            { "sName": "ACCTNO", "bSortable": false },
                                            { "sName": "BALANCE", "bSortable": false }],
                            });
                            $('.cm-cp-new-lending-detail').modal('show');
                        }
                    </script>
                }
                break;
            case "card":
            <script type="text/javascript">
                $(document).ready(function () {
                    var cardColumn = [
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "CARD DEBIT", "bSortable": false },
                                    { "sName": "CARD CREDIT", "bSortable": false },
                                    { "sName": "CREDIT BALANCE", "bSortable": false },
                                    { "sName": "INFO", "bSortable": false }]
                    var cardLenCol = 7;
                    var cardCifCol = 0;
                    switch (@Model.CurrentUser.GroupIdentifier) {
                        case 1:
                            cardColumn =[
                                    { "sName": "REGION", "bSortable": false },
                                    { "sName": "BRANCH", "bSortable": false },
                                    { "sName": "DAO", "bSortable": false },
                                    { "sName": "MSBO", "bSortable": false },
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "CARD DEBIT", "bSortable": false },
                                    { "sName": "CARD CREDIT", "bSortable": false },
                                    { "sName": "CREDIT BALANCE", "bSortable": false },
                                    { "sName": "INFO", "bSortable": false }]
                            cardLenCol = 11;
                            cardCifCol = 4;
                            break;
                        case 2:
                            cardColumn = [
                                    { "sName": "BRANCH", "bSortable": false },
                                    { "sName": "DAO", "bSortable": false },
                                    { "sName": "MSBO", "bSortable": false },
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "CARD DEBIT", "bSortable": false },
                                    { "sName": "CARD CREDIT", "bSortable": false },
                                    { "sName": "CREDIT BALANCE", "bSortable": false },
                                    { "sName": "INFO", "bSortable": false }] ;
                            cardLenCol = 10;
                            cardCifCol = 3;
                            break;
                        case 3:
                            cardColumn =  [
                                    { "sName": "DAO", "bSortable": false },
                                    { "sName": "MSBO", "bSortable": false },
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "CARD DEBIT", "bSortable": false },
                                    { "sName": "CARD CREDIT", "bSortable": false },
                                    { "sName": "CREDIT BALANCE", "bSortable": false },
                                    { "sName": "INFO", "bSortable": false }];
                            cardLenCol = 9;
                            cardCifCol = 2;
                            break;
                        default:
                            break;
                    }
                    $('#total-@item.GroupCode-lbl').click(function () {
                        $('#collapseOne-@item.GroupCode').collapse('show');
                    });
                    $('#new-@item.GroupCode-lbl').click(function () {
                        $('#collapseOne-@item.GroupCode').collapse('show');
                    });

                    var tablecard = $('#cm-customer-portfolio-@item.GroupCode').DataTable({
                        "order": [[0, 'asc']],
                        "bServerSide": true,
                        "bProcessing": true,
                        "responsive": true,
                        "bAutoWidth": false,
                        "aLengthMenu": [10, 30, 50, 100],
                        "pageLength": 10,
                        rowsGroup: [0, 1, 2, 3],
                        "sAjaxSource": '@Url.Action("CustomerPortfolioData","CustomerManager")' + '?type=@item.GroupCode',
                        "fnServerData": function (sSource, aoData, fnCallback) {
                            $.ajax({
                                "dataType": 'json',
                                "type": "POST",
                                "url": sSource,
                                "data": aoData,
                                "success": fnCallback
                            });
                        },
                        "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
                        "sPaginationType": "simple_numbers",//"full_numbers",
                        "aoColumns":cardColumn ,
                        "aoColumnDefs": [{
                            "sClass": "column-title",
                            "aTargets": [cardLenCol],
                            "mRender": function (data, type, full) {
                                return '<a class=\"btn btn-primary btn-xs\" onclick=\"showCustomerInfo(\'' + full[cardCifCol] + '\');\"><i class="fa fa-info"></i></a><a class=\"btn btn-primary btn-xs\" onclick=\"showDetailCustomerCard(\'' + full[cardCifCol] + '\');\"><i class="fa fa-list"></i></a>';
                            }
                        }],
                        initComplete: function () {
                            this.api().columns().every(function () {
                                var column = this;
                                switch (column.context[0].aoHeader[0][column.index()].cell.innerText) {
                                    case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.Zone.ToUpper())':
                                        createFilterRegion(column, '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.Zone)');
                                        break;
                                    case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.DateOpenCifHeader)':
                                        createFilterDate(column);
                                        break;
                                    case '@Html.Raw(@SMECustomerWebsite.Core.Resources.Resource.Branch.ToUpper())':
                                        createFilterBranch(column);
                                        break;
                                    case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.MSBONameHeader.ToUpper())':
                                        createFilterMSBOName(column, 1);
                                        break;
                                    case 'DAO':
                                        createFilterMSBOName(column, 2);
                                        break;
                                    case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.CardScoredHeader)':
                                        createFilterRangeMulti(column, 0, 4,0.5,1);
                                        break;
                                    case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.NoOfCardHeader)':
                                        createFilterRangeMulti(column, 0, 600,1,2);
                                        break;
                                    case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.BalanceCreditHeader)':
                                        createFilterRangeMulti(column, -1000000000, 1000000000,1,3);
                                        break;
                                    default:
                                        if (column.index() < cardLenCol) {
                                            createFilterInputText(column);
                                        }
                                        break;
                                }
                            });
                        },
                        "drawCallback": function (settings) {
                            $('table.custom_table th').removeClass().addClass('column-title');
                        }
                    });
                })
            </script>
                if (true)
                {
                    <script type="text/javascript">
                        function showDetailCustomerCard(cif) {
                            var tableDetailCustomerCard = $('#cm-cp-tb-@item.GroupCode-detail').DataTable({
                                destroy: true,
                                "bServerSide": true,
                                "bProcessing": true,
                                "responsive": true,
                                "bAutoWidth": false,
                                "aLengthMenu": [10, 30, 50, 100],
                                "pageLength": 10,
                                //rowsGroup: [0, 1, 2, 3],
                                "sAjaxSource": '@Url.Action("CustomerCardDetailData", "CustomerManager")' + '?cif=' + cif,
                                "fnServerData": function (sSource, aoData, fnCallback) {
                                    $.ajax({
                                        "dataType": 'json',
                                        "type": "POST",
                                        "url": sSource,
                                        "data": aoData,
                                        "success": fnCallback
                                    });
                                },
                                "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
                                "sPaginationType": "simple_numbers",//"full_numbers",
                                "aoColumns": [
                                            { "sName": "CIF", "bSortable": false },
                                            { "sName": "USERNAME", "bSortable": false },
                                            { "sName": "CIF", "bSortable": false },
                                            { "sName": "USERNAME", "bSortable": false },
                                            { "sName": "CIF", "bSortable": false },
                                            { "sName": "CIF", "bSortable": false },
                                            { "sName": "USERNAME", "bSortable": false },
                                            { "sName": "USERNAME", "bSortable": false },
                                            { "sName": "STATUS", "bSortable": false }],
                                "drawCallback": function (settings) {
                                    $('table.custom_table th').removeClass().addClass('column-title');
                                }
                            });
                            $('.cm-cp-@item.GroupCode-detail').modal('show');
                        };
                    </script>
                }
                break;
            case "i2b":
            <script type="text/javascript">
                $(document).ready(function () {
                    var i2bColumn = [
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "NO USER", "bSortable": false },
                                    { "sName": "INFO", "bSortable": false }]
                    var i2bLenCol = 5;
                    var i2bCifCol = 0;
                    switch (@Model.CurrentUser.GroupIdentifier) {
                        case 1:
                            i2bColumn =[
                                    { "sName": "REGION", "bSortable": false },
                                    { "sName": "BRANCH", "bSortable": false },
                                    { "sName": "DAO", "bSortable": false },
                                    { "sName": "MSBO", "bSortable": false },
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "NO USER", "bSortable": false },
                                    { "sName": "INFO", "bSortable": false }]
                            i2bLenCol = 9;
                            i2bCifCol = 4;
                            break;
                        case 2:
                            i2bColumn = [
                                    { "sName": "BRANCH", "bSortable": false },
                                    { "sName": "DAO", "bSortable": false },
                                    { "sName": "MSBO", "bSortable": false },
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "NO USER", "bSortable": false },
                                    { "sName": "INFO", "bSortable": false }] ;
                            i2bLenCol = 8;
                            i2bCifCol = 3;
                            break;
                        case 3:
                            i2bColumn =  [
                                    { "sName": "DAO", "bSortable": false },
                                    { "sName": "MSBO", "bSortable": false },
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "NO USER", "bSortable": false },
                                    { "sName": "INFO", "bSortable": false }];
                            i2bLenCol = 7;
                            i2bCifCol = 2;
                            break;
                        default:
                            break;
                    }
                    $('#total-@item.GroupCode-lbl').click(function () {
                        $('#collapseOne-@item.GroupCode').collapse('show');
                    });
                    $('#new-@item.GroupCode-lbl').click(function () {
                        $('#collapseOne-@item.GroupCode').collapse('show');
                    });
                    var tableI2B = $('#cm-customer-portfolio-@item.GroupCode').DataTable({
                        "order": [[0, 'asc']],
                        "bServerSide": true,
                        "bProcessing": true,
                        "responsive": true,
                        "bAutoWidth": false,
                        "aLengthMenu": [10, 30, 50, 100],
                        "pageLength": 10,
                        rowsGroup: [0, 1, 2, 3],
                        "sAjaxSource": '@Url.Action("CustomerPortfolioData","CustomerManager")' + '?type=@item.GroupCode',
                        "fnServerData": function (sSource, aoData, fnCallback) {
                            $.ajax({
                                "dataType": 'json',
                                "type": "POST",
                                "url": sSource,
                                "data": aoData,
                                "success": fnCallback
                            });
                        },
                        "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
                        "sPaginationType": "simple_numbers",//"full_numbers",
                        "aoColumns": i2bColumn,
                        "aoColumnDefs": [{
                            "sClass": "column-title",
                            "aTargets": [i2bLenCol-1],
                            "mRender": function (data, type, full) {
                                return '<a class=\"\" onclick=\"showDetailCustomerI2B(\'' + full[i2bCifCol] + '\');\">' + full[i2bLenCol-1] + '</a>';
                            }
                        }, {
                            "aTargets": [i2bLenCol],
                            "mRender": function (data, type, full) {
                                return '<a class=\"btn btn-primary btn-xs\" onclick=\"showCustomerInfo(\'' + full[i2bCifCol] + '\');\"><i class="fa fa-info"></i></a>';
                            }
                        }],
                        initComplete: function () {
                            this.api().columns().every(function () {
                                var column = this;
                                switch (column.context[0].aoHeader[0][column.index()].cell.innerText) {
                                    case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.Zone.ToUpper())':
                                        createFilterRegion(column, '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.Zone)');
                                        break;
                                    case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.DateOpenCifHeader)':
                                        createFilterDate(column);
                                        break;
                                    case '@Html.Raw(@SMECustomerWebsite.Core.Resources.Resource.Branch.ToUpper())':
                                        createFilterBranch(column);
                                        break;
                                    case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.MSBONameHeader.ToUpper())':
                                        createFilterMSBOName(column, 1);
                                        break;
                                    case 'DAO':
                                        createFilterMSBOName(column, 2);
                                        break;
                                    default:
                                        if (column.index() < i2bLenCol) {
                                            createFilterInputText(column);
                                        }
                                        break;
                                }
                            });
                        },
                        "drawCallback": function (settings) {
                            $('table.custom_table th').removeClass().addClass('column-title');
                        }
                    });
                })
            </script>
                if (true)
                {
                    <script type="text/javascript">
                        function showDetailCustomerI2B(cif) {
                            var tableDetailCustomerI2B = $('#cm-cp-tb-@item.GroupCode-detail').DataTable({
                                destroy: true,
                                "bServerSide": true,
                                "bProcessing": true,
                                "responsive": true,
                                "bAutoWidth": false,
                                "aLengthMenu": [10, 30, 50, 100],
                                "pageLength": 10,
                                //rowsGroup: [0, 1, 2, 3],
                                bFilter: false,
                                bInfo: false,
                                bPaginate: false,
                                "sAjaxSource": '@Url.Action("CustomerI2BDetailData", "CustomerManager")' + '?cif=' + cif,
                                "fnServerData": function (sSource, aoData, fnCallback) {
                                    $.ajax({
                                        "dataType": 'json',
                                        "type": "POST",
                                        "url": sSource,
                                        "data": aoData,
                                        "success": fnCallback
                                    });
                                },
                                "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
                                "sPaginationType": "simple_numbers",//"full_numbers",
                                "aoColumns": [
                                            { "sName": "CIF", "bSortable": false },
                                            { "sName": "USERNAME", "bSortable": false },
                                            { "sName": "STATUS", "bSortable": false }],
                            });
                            $('.cm-cp-@item.GroupCode-detail').modal('show');
                        };
                    </script>
                }
                break;
            case "pos":
            <script type="text/javascript">
                $(document).ready(function () {
                    var posColumn =  [
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "NO POS", "bSortable": false },
                                    { "sName": "TRANSACTION IN MONTH", "bSortable": false },
                                    { "sName": "ADDRESS", "bSortable": false }]
                    var posLenCol = 6;
                    var posCifCol = 0;
                    switch (@Model.CurrentUser.GroupIdentifier) {
                        case 1:
                            posColumn = [
                                    { "sName": "REGION", "bSortable": false },
                                    { "sName": "BRANCH", "bSortable": false },
                                    { "sName": "DAO", "bSortable": false },
                                    { "sName": "MSBO", "bSortable": false },
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "NO POS", "bSortable": false },
                                    { "sName": "TRANSACTION IN MONTH", "bSortable": false },
                                    { "sName": "ADDRESS", "bSortable": false }]
                            posLenCol = 10;
                            posCifCol = 4;
                            break;
                        case 2:
                            posColumn =  [
                                    { "sName": "BRANCH", "bSortable": false },
                                    { "sName": "DAO", "bSortable": false },
                                    { "sName": "MSBO", "bSortable": false },
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "NO POS", "bSortable": false },
                                    { "sName": "TRANSACTION IN MONTH", "bSortable": false },
                                    { "sName": "ADDRESS", "bSortable": false }] ;
                            posLenCol = 9;
                            posCifCol = 3;
                            break;
                        case 3:
                            posColumn =  [
                                    { "sName": "DAO", "bSortable": false },
                                    { "sName": "MSBO", "bSortable": false },
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "NO POS", "bSortable": false },
                                    { "sName": "TRANSACTION IN MONTH", "bSortable": false },
                                    { "sName": "ADDRESS", "bSortable": false }];
                            posLenCol = 8;
                            posCifCol = 2;
                            break;
                        default:
                            break;
                    }
                    $('#total-@item.GroupCode-lbl').click(function () {
                        $('#collapseOne-@item.GroupCode').collapse('show');
                    });
                    $('#new-@item.GroupCode-lbl').click(function () {
                        $('#collapseOne-@item.GroupCode').collapse('show');
                    });
                    var tablepos = $('#cm-customer-portfolio-@item.GroupCode').DataTable({
                        "order": [[0, 'asc']],
                        "bServerSide": true,
                        "bProcessing": true,
                        "responsive": true,
                        "bAutoWidth": false,
                        "aLengthMenu": [10, 30, 50, 100],
                        "pageLength": 10,
                        rowsGroup: [0, 1, 2, 3],
                        "sAjaxSource": '@Url.Action("CustomerPortfolioData","CustomerManager")' + '?type=@item.GroupCode',
                        "fnServerData": function (sSource, aoData, fnCallback) {
                            $.ajax({
                                "dataType": 'json',
                                "type": "POST",
                                "url": sSource,
                                "data": aoData,
                                "success": fnCallback
                            });
                        },
                        "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
                        "sPaginationType": "simple_numbers",//"full_numbers",
                        "aoColumns":posColumn,
                        "aoColumnDefs": [{
                            "sClass": "column-title",
                            "aTargets": [posLenCol],
                            "mRender": function (data, type, full) {
                                return '<a class=\"btn btn-primary btn-xs\" onclick=\"showCustomerInfo(\'' + full[posCifCol] + '\');\"><i class="fa fa-info"></i></a>';
                            }
                        }],
                        initComplete: function () {
                            this.api().columns().every(function () {
                                var column = this;
                                switch (column.context[0].aoHeader[0][column.index()].cell.innerText) {
                                    case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.Zone.ToUpper())':
                                        createFilterRegion(column, '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.Zone)');
                                        break;
                                    case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.DateOpenCifHeader)':
                                        createFilterDate(column);
                                        break;
                                    case '@Html.Raw(@SMECustomerWebsite.Core.Resources.Resource.Branch.ToUpper())':
                                        createFilterBranch(column);
                                        break;
                                    case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.MSBONameHeader.ToUpper())':
                                        createFilterMSBOName(column, 1);
                                        break;
                                    case 'DAO':
                                        createFilterMSBOName(column, 2);
                                        break;
                                    default:
                                        if (column.index() < posLenCol) {
                                            createFilterInputText(column);
                                        }
                                        break;
                                }
                            });
                        },
                        "drawCallback": function (settings) {
                            $('table.custom_table th').removeClass().addClass('column-title');
                        }
                    });
                })
            </script>
                break;
            case "trade":
            <script type="text/javascript">
                $(document).ready(function () {
                    var tradeColumn =  [
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "TTQT", "bSortable": false },
                                    { "sName": "BL", "bSortable": false },
                                    { "sName": "TradeLoan", "bSortable": false },
                                    { "sName": "ADDRESS", "bSortable": false }]
                    var tradeLenCol = 7;
                    var tradeCifCol = 0;
                    switch (@Model.CurrentUser.GroupIdentifier) {
                        case 1:
                            tradeColumn =[
                                    { "sName": "REGION", "bSortable": false },
                                    { "sName": "BRANCH", "bSortable": false },
                                    { "sName": "DAO", "bSortable": false },
                                    { "sName": "MSBO", "bSortable": false },
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "TTQT", "bSortable": false },
                                    { "sName": "BL", "bSortable": false },
                                    { "sName": "TradeLoan", "bSortable": false },
                                    { "sName": "ADDRESS", "bSortable": false }]
                            tradeLenCol = 11;
                            tradeCifCol = 4;
                            break;
                        case 2:
                            tradeColumn = [
                                    { "sName": "BRANCH", "bSortable": false },
                                    { "sName": "DAO", "bSortable": false },
                                    { "sName": "MSBO", "bSortable": false },
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "TTQT", "bSortable": false },
                                    { "sName": "BL", "bSortable": false },
                                    { "sName": "TradeLoan", "bSortable": false },
                                    { "sName": "ADDRESS", "bSortable": false }];
                            tradeLenCol = 10;
                            tradeCifCol = 3;
                            break;
                        case 3:
                            tradeColumn = [
                                    { "sName": "DAO", "bSortable": false },
                                    { "sName": "MSBO", "bSortable": false },
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "TTQT", "bSortable": false },
                                    { "sName": "BL", "bSortable": false },
                                    { "sName": "TradeLoan", "bSortable": false },
                                    { "sName": "ADDRESS", "bSortable": false }];
                            tradeLenCol = 9;
                            tradeCifCol = 2;
                            break;
                        default:
                            break;
                    }
                    $('#total-@item.GroupCode-lbl').click(function () {
                        $('#collapseOne-@item.GroupCode').collapse('show');
                    });
                    $('#new-@item.GroupCode-lbl').click(function () {
                        $('#collapseOne-@item.GroupCode').collapse('show');
                    });
                    var tablepos = $('#cm-customer-portfolio-@item.GroupCode').DataTable({
                        "order": [[0, 'asc']],
                        "bServerSide": true,
                        "bProcessing": true,
                        "responsive": true,
                        "bAutoWidth": false,
                        "aLengthMenu": [10, 30, 50, 100],
                        "pageLength": 10,
                        rowsGroup: [0, 1, 2, 3],
                        "sAjaxSource": '@Url.Action("CustomerPortfolioData","CustomerManager")' + '?type=@item.GroupCode',
                        "fnServerData": function (sSource, aoData, fnCallback) {
                            $.ajax({
                                "dataType": 'json',
                                "type": "POST",
                                "url": sSource,
                                "data": aoData,
                                "success": fnCallback
                            });
                        },
                        "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
                        "sPaginationType": "simple_numbers",//"full_numbers",
                        "aoColumns": tradeColumn,
                        "aoColumnDefs": [{
                            "sClass": "column-title",
                            "aTargets": [tradeLenCol],
                            "mRender": function (data, type, full) {
                                return '<a class=\"btn btn-primary btn-xs\" onclick=\"showCustomerInfo(\'' + full[tradeCifCol] + '\');\"><i class="fa fa-info"></i></a>';
                            }
                        }],
                        initComplete: function () {
                            this.api().columns().every(function () {
                                var column = this;
                                switch (column.context[0].aoHeader[0][column.index()].cell.innerText) {
                                    case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.Zone.ToUpper())':
                                        createFilterRegion(column, '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.Zone)');
                                        break;
                                    case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.DateOpenCifHeader)':
                                        createFilterDate(column);
                                        break;
                                    case '@Html.Raw(@SMECustomerWebsite.Core.Resources.Resource.Branch.ToUpper())':
                                        createFilterBranch(column);
                                        break;
                                    case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.MSBONameHeader.ToUpper())':
                                        createFilterMSBOName(column, 1);
                                        break;
                                    case 'DAO':
                                        createFilterMSBOName(column, 2);
                                        break;
                                    default:
                                        if (column.index() < tradeLenCol) {
                                            createFilterInputText(column);
                                        }
                                        break;
                                }
                            });
                        },
                        "drawCallback": function (settings) {
                            $('table.custom_table th').removeClass().addClass('column-title');
                        }
                    });
                })
            </script>
                break;
            case "chuoi":
            <script type="text/javascript">
                $(document).ready(function () {
                    var chuoiColumn =  [
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "TTQT", "bSortable": false },
                                    { "sName": "ADDRESS", "bSortable": false }]
                    var chuoiLenCol = 5;
                    var chuoiCifCol = 0;
                    switch (@Model.CurrentUser.GroupIdentifier) {
                        case 1:
                            chuoiColumn =[
                                    { "sName": "REGION", "bSortable": false },
                                    { "sName": "BRANCH", "bSortable": false },
                                    { "sName": "DAO", "bSortable": false },
                                    { "sName": "MSBO", "bSortable": false },
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "TTQT", "bSortable": false },
                                    { "sName": "ADDRESS", "bSortable": false }]
                            chuoiLenCol = 9;
                            chuoiCifCol = 4;
                            break;
                        case 2:
                            chuoiColumn = [
                                    { "sName": "BRANCH", "bSortable": false },
                                    { "sName": "DAO", "bSortable": false },
                                    { "sName": "MSBO", "bSortable": false },
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "TTQT", "bSortable": false },
                                    { "sName": "ADDRESS", "bSortable": false }];
                            chuoiLenCol = 8;
                            chuoiCifCol = 3;
                            break;
                        case 3:
                            chuoiColumn = [
                                    { "sName": "DAO", "bSortable": false },
                                    { "sName": "MSBO", "bSortable": false },
                                    { "sName": "CIF", "bSortable": false },
                                    { "sName": "NAME", "bSortable": false },
                                    { "sName": "VPB INDUSTRY", "bSortable": false },
                                    { "sName": "DATE OPEN CIF", "bSortable": false },
                                    { "sName": "TTQT", "bSortable": false },
                                    { "sName": "ADDRESS", "bSortable": false }];
                            chuoiLenCol = 7;
                            chuoiCifCol = 2;
                            break;
                        default:
                            break;
                    }
                    $('#total-@item.GroupCode-lbl').click(function () {
                        $('#collapseOne-@item.GroupCode').collapse('show');
                    });
                    $('#new-@item.GroupCode-lbl').click(function () {
                        $('#collapseOne-@item.GroupCode').collapse('show');
                    });
                    var tablepos = $('#cm-customer-portfolio-@item.GroupCode').DataTable({
                        "order": [[0, 'asc']],
                        "bServerSide": true,
                        "bProcessing": true,
                        "responsive": true,
                        "bAutoWidth": false,
                        "aLengthMenu": [10, 30, 50, 100],
                        "pageLength": 10,
                        rowsGroup: [0, 1, 2, 3],
                        "sAjaxSource": '@Url.Action("CustomerPortfolioData","CustomerManager")' + '?type=@item.GroupCode',
                        "fnServerData": function (sSource, aoData, fnCallback) {
                            $.ajax({
                                "dataType": 'json',
                                "type": "POST",
                                "url": sSource,
                                "data": aoData,
                                "success": fnCallback
                            });
                        },
                        "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'dataTables_wrapper'ip>>",
                        "sPaginationType": "simple_numbers",//"full_numbers",
                        "aoColumns": chuoiColumn,
                        "aoColumnDefs": [{
                            "sClass": "column-title",
                            "aTargets": [chuoiLenCol],
                            "mRender": function (data, type, full) {
                                return '<a class=\"btn btn-primary btn-xs\" onclick=\"showCustomerInfo(\'' + full[chuoiCifCol] + '\');\"><i class="fa fa-info"></i></a>';
                            }
                        }],
                        initComplete: function () {
                            this.api().columns().every(function () {
                                var column = this;
                                switch (column.context[0].aoHeader[0][column.index()].cell.innerText) {
                                    case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.Zone.ToUpper())':
                                        createFilterRegion(column, '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.Zone)');
                                        break;
                                    case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.DateOpenCifHeader)':
                                        createFilterDate(column);
                                        break;
                                    case '@Html.Raw(@SMECustomerWebsite.Core.Resources.Resource.Branch.ToUpper())':
                                        createFilterBranch(column);
                                        break;
                                    case '@Html.Raw(SMECustomerWebsite.Core.Resources.Resource.MSBONameHeader.ToUpper())':
                                        createFilterMSBOName(column, 1);
                                        break;
                                    case 'DAO':
                                        createFilterMSBOName(column, 2);
                                        break;
                                    default:
                                        if (column.index() < chuoiLenCol) {
                                            createFilterInputText(column);
                                        }
                                        break;
                                }
                            });
                        }
                    });
                })
            </script>
                break;
            default:
                break;
        }
    }
    <!-- Ion.RangeSlider -->
    <script>
        $(document).ready(function () {
            $("#range_25").ionRangeSlider({
                type: "double",
                keyboard: true,
                step: 100000,
                min: 0,
                max: 1000000000,
                grid: true
            });
        });
    </script>
    <!-- /Ion.RangeSlider -->
    @if (true)
    {
        <script type="text/javascript">
            function startPageTourGuide() {
                var intro = introJs();
                var steps = [
                ];

                if ($('#panel_deposit').length > 0) {
                    steps.push({
                        element: '#panel_deposit',
                        intro: '@SMECustomerWebsite.Core.Resources.Resource.TourGuidePortfolioDeposit',
                        position: 'left'
                    });
                }
                if ($('#panel_loan').length > 0) {
                    steps.push({
                        element: '#panel_loan',
                        intro: '@SMECustomerWebsite.Core.Resources.Resource.TourGuidePortfolioLoan',
                        position: 'left'
                    });
                }
                if ($('#panel_card').length > 0) {
                    steps.push({
                        element: '#panel_card',
                        intro: '@SMECustomerWebsite.Core.Resources.Resource.TourGuidePortfolioCard',
                        position: 'left'
                    });
                }
                if ($('#panel_pos').length > 0) {
                    steps.push({
                        element: '#panel_pos',
                        intro: '@SMECustomerWebsite.Core.Resources.Resource.TourGuidePortfolioPos',
                        position: 'left'
                    });
                }
                if ($('#panel_i2b').length > 0) {
                    steps.push({
                        element: '#panel_i2b',
                        intro: '@SMECustomerWebsite.Core.Resources.Resource.TourGuidePortfolioI2b',
                        position: 'left'
                    });
                }
                if ($('#panel_trade').length > 0) {
                    steps.push({
                        element: '#panel_trade',
                        intro: '@SMECustomerWebsite.Core.Resources.Resource.TourGuidePortfolioTrade',
                        position: 'left'
                    });
                }
                if ($('#panel_chuoi').length > 0) {
                    steps.push({
                        element: '#panel_chuoi',
                        intro: '@SMECustomerWebsite.Core.Resources.Resource.TourGuidePortfolioChuoi',
                        position: 'left'
                    });
                }
                @*if ($('#collapseOne-deposit').length > 0) {
                    $('#collapseOne-deposit').collapse('show');
                    steps.push({
                        element: '#collapseOne-deposit',
                        intro: '@SMECustomerWebsite.Core.Resources.Resource.TourGuideHeaderIMEX',
                        position: 'left'
                    });
                }*@
                intro.setOptions({
                    steps: steps,
                    showProgress: true,
                    scrollToElement: true,
                });
                intro.setOption('tooltipPosition', 'auto');
                intro.setOption('positionPrecedence', ['left', 'right', 'bottom', 'top'])
                intro.start();
            }
        </script>
    }
}